<template>
  <tr>
    <td>{{lineData.time}}</td>
    <td>{{userData.name}}</td>
    <td>{{userData.id}}</td>
    <td>{{userData.age}}</td>
    <td>{{userData.sex}}</td>
    <td>{{userData.type}}</td>
    <td>{{userData.rank}}</td>
    <td>{{userData.time}}</td>
    <td>{{workingYears}}</td>
    <td>
      <BelbinElement :raw="belbinData"></BelbinElement>
    </td>
    <td>
      <HollandElement :raw="hollandData.values"></HollandElement>
    </td>
    <td>
      <HollandCareerElement :raw="hollandData.inputs[0]"></HollandCareerElement>
    </td>
    <td>
      <HollandConditionElement :raw="hollandData.inputs[1]"></HollandConditionElement>
    </td>
  </tr>
</template>

<script>
import BelbinElement from "@/components/admin/elements/BelbinElement.vue";
import HollandElement from "@/components/admin/elements/HollandElement.vue";
import HollandCareerElement from "@/components/admin/elements/HollandCareerElement.vue";
import HollandConditionElement from "@/components/admin/elements/HollandConditionElement.vue";
export default {
  name: "TableLine",
  props: ["lineData"],
  components: {
    BelbinElement,
    HollandElement,
    HollandCareerElement,
    HollandConditionElement
  },
  computed: {
    devMode() {
      return this.$store.state.devMode;
    },
    userData() {
      return JSON.parse(this.lineData.usrinfo);
    },
    hollandData() {
      return JSON.parse(this.lineData.holland);
    },
    belbinData() {
      return JSON.parse(this.lineData.belbin);
    },
    workingYears() {
      let a = this.userData.time.split("-");
      let y = parseInt(a[0]);
      let m = parseInt(a[1]);
      let n = new Date();
      let v = n.getFullYear() - y + (n.getMonth() + 1 - m) / 12;
      v = v.toFixed(1);
      return v;
    }
  },
  mounted() {
    if (this.devMode) {
      window.console.log(this.lineData);
    }
  },
  created() {}
};
</script>

<style scoped>
</style>